<template>
  <view v-bind="$attrs" class="tz-icon iconfont" :class="['tz-icon-' + name]">
    <slot />
  </view>
</template>
<script>
export default {
  name: "TzIcon",
  inheritAttrs: false,
  props: {
    name: {
      type: String,
      default: "",
    },
  },
  setup() {
    return {};
  },
};
</script>

<style lang="scss">
.tz-icon {
  display: inline-block;
  position: relative;
  -webkit-font-smoothing: antialiased;
  color: inherit;
  font-size: 21px;
  text-rendering: auto;
  vertical-align: middle;
  line-height: 1.1;
  margin-top: 0.12em;
  &::before {
    display: inline-block;
  }
}
</style>
